<template>
    <div class="dv1">{{ obj.message }}</div>
    <div class="dv2">{{ message1 }}</div>
</template>
<script setup>
//导入reactive
    import {reactive,ref} from "vue";
    const obj = reactive({ message: '不畏浮云遮望眼，自缘身在最高层' })
    let message1 = ref("普通数据");
setTimeout(() => {
  obj.message = '欲穷千里目，更上一层楼'
  message1.value = '新的响应式数据'
}, 2000)

</script>
<style scoped>
.dv1{
    color: yellow;
    font-size: 30px;
    font-weight: bold;
}
.dv2{
    color: red;
    font-size: 30px;
    font-weight: bold;
}

</style>